$(function () {
    $("#jqGrid").jqGrid({
        url:baseURL+"sys/appMenu/list" ,
        datatype: "json",
        colModel: [
            { label: '图标id', name: 'menuId', width: 80,align:'center' , sortable: false},
            { label: '名称', name: 'name', width: 80, align:'center' , sortable: false},
            { label: '图片', name: 'img', width: 120,align:'center' , sortable: false,formatter:function (value,options,row) {
                    return '<img src="'+value+'" width="25%" height="auto">';
                } },
            { label: '状态', name: 'state', width: 40,align:'center',formatter:function (value,options,row) {
                    return value==1?"显示":"隐藏";
                } , sortable: false},
            { label: '类型', name: 'type', width:120,align:'center' , sortable: false,formatter:function (value,options,row) {
                    return value==1?"工具":value==2?"服务":"其他";
                }},

            { label: '创建时间', name: 'createDate', width:75,align:'center' , sortable: false},
        ],
		viewrecords: true,
        height: 375,
        rowNum: 10,
		rowList : [10,30,50],
        rownumbers: true, 
        rownumWidth: 25, 
        autowidth:true,
        multiselect:true,
        multiboxonly:true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        gridComplete:function(){
        	//隐藏grid底部滚动条
        	$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 
        }
    });
    vm.initTypes()
});



var vm = new Vue({
    el:'#rrapp',
    data:{
        q:{
            type:0
        },
        showList: true,
        showUpdate:false,
        title:null,
        appMenu:{
            menuId:null,
            name:null,
            img:null,
            state:1,
            type:0
        },
        states:[{
            value:1,
            msg:'显示'
        },{
            value:2,
            msg:'隐藏'
        }],
        types:[]

    },
    methods: {
        query: function () {
            vm.reload();
        },
        clean: function () {
            vm.showList = true;
            vm.reload();
        },
        update: function () {
            var rowid=getSelectedRow();
            var row = $("#jqGrid").jqGrid('getRowData', rowid);
            if(rowid==null){
                return;
            }
            let menuId=row.menuId;
            vm.showList = false;
            vm.showUpdate = true;
            vm.title = "修改";
            $("#menuImg").val("");
            $.get(baseURL+"sys/appMenu/queryById/"+menuId,result=>{
                vm.appMenu=result.appMenu;
            })
        },
        modify: function () {
            let bannerEls=$("#menuImg").val();
            if(bannerEls==null || bannerEls ==''){
                vm.commitUpdate();
            }else{
                var formData=new FormData($("form")[1]);
                formData.append("file",$("#menuImg")[0]);
                $.ajax({
                    url:baseURL+"sys/orBanner/uploadBanner",
                    datatype:'json' ,
                    type:'post',
                    data:formData,
                    cache:false,
                    traditional: true,
                    contentType: false,
                    processData: false,
                    success:function (msg) {
                        if(msg.url!=null && msg.url!=''){
                            vm.appMenu.img=msg.url;
                            vm.commitUpdate();
                        }
                    }
                })
            }
        },
        reload: function () {
            vm.showList = true;
            vm.showUpdate = false;
            $("#jqGrid").jqGrid('setGridParam', {
                postData: {
                    'type': vm.q.type,
                },
               page: 1
            }).trigger("reloadGrid");

        },
        commitUpdate:function () {
            if(vm.appMenu.type==0){
                layer.msg("请选择类型");
                return;
            }
            $.ajax({
                url: baseURL + "sys/appMenu/update",
                type: "post",
                contentType: "application/json",
                data: JSON.stringify(vm.appMenu),
                success: function (r) {
                    if (r.code == 0) {
                        alert(r.msg);
                        vm.reload();
                    } else {
                        alert(r.msg)
                    }
                }
            })
        },initTypes(){
            $.get(baseURL+"sys/appMenu/getMenuType",r=>{
                console.log(r)
                vm.$set(vm.types,0,{
                    menuType:"0",
                    typeName:"类型选择"
                })
                for (let i=0;i<r.types.length;i++){
                    vm.$set(vm.types,(i+1),r.types[i])
                }
            })
        }



    }
});
